$euiBorderWidthThick: 2px !default;

.euiButton {
  text-decoration: none !important;
  color: var(--euiColorGhost) !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
  height: 42px !important;
  line-height: 42px !important;

  &.euiButton--secondary {
    color: var(--buttonSecondaryTextColor) !important;
    border-color: var(--euiColorSecondary);
    &:not([class*="isDisabled"]) {
      &:hover {
        background-color: var(--buttonSecondaryHoverColor);
        border-color: var(--buttonSecondaryHoverColor);
        color: var(--euiColorPrimaryText) !important;
      }
    }
    &:focus:not(:hover),
    &:focus-within:not(:hover) {
      border: 1px solid var(--euiColorPrimary);
      outline: 1px solid var(--euiColorPrimary);
    }
    .euiTextColor--default {
      color: currentColor;
    }
  }
  &.euiButton--primary {
    &:not([class*="isDisabled"]) {
      box-shadow: none;
    }
  }
  &.euiButton--fill {
    color: var(--euiColorPrimaryText) !important;
    &:hover {
      color: var(--euiColorPrimaryText) !important;
    }
    &:focus:not(:hover),
    &:focus-within:not(:hover) {
      border: 1px solid var(--euiColorPrimary);
      outline: 1px solid var(--euiColorPrimary);
    }
  }
}
.euiButton.euiButton--fill {
  &.euiButton--secondary {
    border-color: var(--euiColorSecondary);
    background-color: var(--euiColorSecondary);

    &:not([class*="isDisabled"]) {
      &:hover {
        background-color: var(--buttonSecondaryHoverColor);
        border-color: var(--buttonSecondaryHoverColor);
      }
      &:focus:not(:hover),
      &:focus-within:not(:hover) {
        border: 1px solid var(--euiColorPrimary);
        outline: 1px solid var(--euiColorPrimary);
      }
    }
  }
}
.euiButton.euiBorderWidthThick {
  border-width: $euiBorderWidthThick;
}

.euiButton.euiButton-isDisabled.euiButton--fill {
  opacity: 0.6;
  &.euiButton--secondary {
    border-color: var(--euiColorSecondary);
    background-color: var(--euiColorSecondary);
    color: var(--buttonSecondaryDisabledTextColor) !important;
    &:hover {
      background-color: var(--euiColorSecondary);
    }
  }
  &.euiButton--primary {
    border-color: var(--euiColorPrimary);
    background-color: var(--euiColorPrimary);
    &:hover {
      background-color: var(--euiColorPrimary);
    }
  }
  &.euiButton--warning {
    border-color: var(--euiColorColorWarning);
    background-color: var(--euiColorColorWarning);
    &:hover {
      background-color: var(--euiColorColorWarning);
    }
  }
  &.euiButton--danger {
    border-color: var(--euiColorColorDanger);
    background-color: var(--euiColorColorWarning);
    &:hover {
      background-color: var(--euiColorColorDanger);
    }
  }
}

.euiButton__text {
  font:
    normal normal 500 15px/20px Graphik,
    sans-serif !important;
}

.euiButtonEmpty__text {
  font:
    normal normal 400 14px/18px Graphik,
    sans-serif;
}

.euiButton--small {
  height: 30px !important;
  line-height: 30px !important;
  .euiButton__text {
    font:
      normal normal 500 13px/16px Graphik,
      sans-serif !important;
  }
}

.euiButton {
  &.euiButton--warning.euiButton--fill:not([class*="isDisabled"]) {
    background-color: var(--buttonWarningColor);
    border-color: var(--buttonWarningColor);

    &:hover,
    &:focus,
    &:focus-within {
      background-color: var(--buttonWarningHoverColor);
      border-color: var(--buttonWarningHoverColor);
      outline-color: var(--buttonWarningHoverColor);
    }
  }
}

.euiButtonEmpty.euiButtonEmpty--primary {
  border-radius: 4px;
  color: var(--euiTextSubduedColor);
  background-color: transparent;
  transition:
    color ease 0.3s,
    background-color ease 0.3s;

  &:not([class*="isDisabled"]) {
    .euiButtonEmpty__text,
    .euiText {
      transition: color ease 0.3s;
      color: var(--euiTextSubduedColor) !important;
    }

    &:hover,
    &:focus {
      text-decoration: none !important;
      background-color: var(--hoverInListColorDarken);
      color: var(--htmlColor);

      .euiButtonEmpty__text,
      .euiText {
        color: var(--htmlColor) !important;
      }
    }
  }
}

.euiButtonIcon.euiButtonIcon--primary {
  color: var(--iconsDefaultColor);
  &:hover {
    color: var(--iconsDefaultHoverColor);
  }
  &[disabled] {
    color: var(--controlsBorderColor);
  }
}

.euiButtonIcon--text,
.euiButtonEmpty--text {
  color: var(--euiTextSubduedColorHover) !important;
}

.btnLikeLink {
  font: inherit !important;
}
